<!DOCTYPE html>
<html>
<head>
    <?=$var['base_modificada']?>
	<title><?=$var['titulo']?></title>
	<meta charset="utf-8"/>
	<meta name="apple-mobile-web-app-capable" content="yes"/>
	<meta name="viewport" content = "user-scalable=no, width=device-width"/>
	<link rel="shortcut icon" href="Cliente/Imagenes/favicon.ico"> 
	
	<!-- ESTILOS --->	
	    
        <link rel="stylesheet" href="Cliente/Estilo/bootstrap.css">        <!--+--->
        <link rel="stylesheet" href="Cliente/Estilo/font-awesome.css">         <!--iconos--->
        <link rel="stylesheet" href="Cliente/Estilo/template.css">     <!--+--->
	
		<link rel="stylesheet" href="Cliente/Estilo/estructura.css">		
	
		<link rel="stylesheet" href="Cliente/Estilo/producto.css">	
		<link type="text/css" href="Cliente/Scripts/Librerias/sliderProducto/css3.css" rel="stylesheet" /> <!-- slider-->
		<link type="text/css" rel="stylesheet" media="all" href="Cliente/Scripts/Librerias/fancybox/jquery.fancybox.css" />
		
		<link type="text/css" rel="stylesheet" media="all" href="Cliente/Estilo/chat.css" />

		
	<!-- LIBRERIAS -->		
	<!--script src="Cliente/Scripts/Librerias/modernizr-2.6.1-respond-1.1.0.min.js"></script-->
	<script type="text/javascript" src="Cliente/Scripts/Librerias/jquery-1.11.1.min.js"></script>
	<script src="Cliente/Scripts/Librerias/bootstrap.js"></script>	
	
	<!--script type="text/javascript" src="https://ajax.googleapis.com/ajax/libs/jquery/1.9.1/jquery.js"></script> <!-- slider-->
		<script type="text/javascript" src="Cliente/Scripts/Librerias/fancybox/jquery.fancybox.js"></script>
        <script type="text/javascript" src="Cliente/Scripts/Librerias/sliderProducto/lib/jquery.jcarousel.min.js"></script> <!-- slider-->
		<script type="text/javascript" src="Cliente/Scripts/Librerias/sliderProducto/lib/jquery.pikachoose.min.js"></script> <!-- slider-->
		<script type="text/javascript" src="Cliente/Scripts/Librerias/sliderProducto/lib/jquery.touchwipe.min.js"></script> <!-- slider-->
		<script src="http://maps.googleapis.com/maps/api/js?sensor=false" type="text/javascript"></script>
		<script type="text/javascript" src="Cliente/Scripts/Librerias/gmap3.min.js"></script>
		<script src="Cliente/Scripts/accionesTrueques.js"></script>
		<script type="text/javascript" src="Cliente/Scripts/map_manager.js"></script>
		
	<!-- SCRIPTS -->						
	<script language="javascript">			
			$(document).ready(function (){
				$("#pikame").PikaChoose();
				
				<? 
					if((int)$var['mi_propuesta']>0){
						echo "
						$('#btnBPropuesta').click(function(){
							if(confirm('¿Desea borrar su propuesta?')){
								location = 'mi-propuesta/borrar:{$var['mi_propuesta']}:{$var['url_producto']}';
							}
						});
						
						$('#btnMPropuesta').click(function(){
							location = 'mi-propuesta/editar:{$var['mi_propuesta']}';							
						});
						
						";
					} 
					else{
						echo "												
						$('#btnAPropuesta').click(function(){
							location = 'mi-propuesta/nueva:{$var['id_producto']}';							
						});
						
						";
					
					}
				?>
								
				var por_unica = true;
				
				$(".verMapa").fancybox({
					minWidth	: 640,
					minHeight	: 480,
					fitToView	: false,
					autoSize	: true,
					closeClick	: false,
					helpers : {
						title : {
							type: 'inside',
							position : 'top'
						}
					},
					afterShow: function(){
						if(por_unica){ crearMapa("mapa_ubicacion", null, null); por_unica = false; }
						ponerMarca("mapa_ubicacion", <?=$var['lat']?>, <?=$var['lng']?>, 22);
                        $("#mapa_ubicacion").gmap3({trigger:"resize"});
                    }
				});
				
								
			});	
	</script>
	

</head>
	<body>
	<? include $APP->header;?>
	<div class="todo">
		<div class="container"> 
			<div id="tituloProducto">	
				<?=$var['titulo']?> 
			</div>
			<div class="col-md-12 col-sm-12 text-center">
				<div class="sliderProducto col-md-4 col-sm-6">
						
							<div class="pikachoose">
								<ul id="pikame">
									<li><img src="Cliente/Imagenes/Productos/<?=$var['foto1']?>.png"/></li>
									<li><img src="Cliente/Imagenes/Productos/<?=$var['foto2']?>.png"/></li>
									<li><img src="Cliente/Imagenes/Productos/<?=$var['foto3']?>.png"/></li>
								</ul>
							</div>	
				</div>	
				
				<div class="col-md-5 col-sm-6 text-center" >		
					<div id="descripcionProducto">			
						<span> Descripción: </span> <?=$var['descripcion']?> 
					
						<div style="position:absolute; bottom:5px;">
							<a title="Ubicación aproximada de entrega" class="btnSimilares verMapa" href="#mi-mapa"><i class="fa fa-map-marker"></i> UBICACIÓN APROXIMADA</a>
							
							<!--div class="caja">
								<a class="btnSimilares"><i class="fa fa-eye"></i> TRUEQUES SIMILARES</a>
								<div class="info">
									<img src="Cliente/Imagenes/Productos/default_producto.png" />
									
									<img src="Cliente/Imagenes/flechas.png" />
									<img src="Cliente/Imagenes/Productos/default_producto.png" />
									<img src="Cliente/Imagenes/Productos/default_producto.png" />
									<img src="Cliente/Imagenes/Productos/default_producto.png" />
									<img src="Cliente/Imagenes/Productos/default_producto.png" />
									<br>
									<img src="Cliente/Imagenes/Productos/default_producto.png" />
									
									<img src="Cliente/Imagenes/flechas.png" />
									<img src="Cliente/Imagenes/Productos/default_producto.png" />
									<img src="Cliente/Imagenes/Productos/default_producto.png" />
									<img src="Cliente/Imagenes/Productos/default_producto.png" />
									<img src="Cliente/Imagenes/Productos/default_producto.png" />
									<br>
									<img src="Cliente/Imagenes/Productos/default_producto.png" />
									
									<img src="Cliente/Imagenes/flechas.png" />
									<img src="Cliente/Imagenes/Productos/default_producto.png" />
									<img src="Cliente/Imagenes/Productos/default_producto.png" />
									<img src="Cliente/Imagenes/Productos/default_producto.png" />
									<img src="Cliente/Imagenes/Productos/default_producto.png" />
								</div>
							</div-->		
						</div>
			
							
			
					
					</div>
				  
				</div>
			
				<div class="usuarioOfertante col-md-3 col-sm-12 ">	
					<div class="datosUsuario col-md-12 col-sm-12 ">
						<div id="avatarUsuario" class="col-md-12 col-sm-12">			 
							<a href="perfil-usuario/<?=$var['url_usuario_ofrece']?>">
								<img src="Cliente/Imagenes/Usuarios/<?=$var['foto_usuario_ofrece']?>.png" />
							</a>	
						</div>
						<div id="nombreUsuario" class="col-md-12 col-sm-12">			
						<a href="perfil-usuario/<?=$var['nombre']?>"><?=$var['nombre']?></a> 
						</div>
						<span>Prestigio: <?=$var['prestigio']?> <i class="fa fa-star"></i><span>
					</div>
					<div class="botonesContacto col-md-12  col-sm-12">	
						<button type="submit" id="btnMensaje" class="boton" onclick="chatWith('<?=$var['url_usuario_ofrece']?>')"> <i class="fa fa-comments-o"></i> Enviar mensaje</button>	
						<br><br>
						
						<a class="enlaceCompatirF" title="Compartir en Facebook" href="javascript:var dir=window.document.URL;var tit=window.document.title;var tit2=encodeURIComponent(tit);var dir2= encodeURIComponent(dir);window.location.href=('http://www.facebook.com/share.php?u='+dir2+'&amp;t='+tit2+'');"><i class="fa fa-facebook"></i></a>
                        <a class="enlaceCompatirT" title="Compartir en Twitter" href="javascript:var dir=window.document.URL;var tit=window.document.title;var tit2=encodeURIComponent(tit);window.location.href=('http://twitter.com/?status='+tit2+'%20'+dir+'');"><i class="fa fa-twitter"></i></a>
						<a class="enlaceCompatirG" title="Compartir en Google+" href="javascript:window.location.href='https://plus.google.com/share?url='+encodeURIComponent(location);void0;"><i class="fa fa-google-plus"></i></a>
						<br><br>
						<a href="denuncia/usuario:<?=$var['id_usuario_ofrece']?>">Denunciar producto</a>
					
					</div>
				</div>
			</div>	
            
			
					
		</div><!--container-->
		
				<div id="propuestas" class="text-center">
					<div class="tituloPropuesta">  <i class="fa fa-flag"></i> Propuestas  </div>
					<div class="botonesPropuesta">
						<?
						  if(!$var['es_mi_producto']){
							  if((int)$var['mi_propuesta']>0){
								echo '<button id="btnMPropuesta" class="botonMejora"><a> <i class="fa fa-edit"></i> Editar mi propuesta</a></button>';	
								echo '<button id="btnBPropuesta" class="botonElimina"><a> <i class="fa fa-times"></i> Borrar mi propuesta</a></button>';
							  }
							  else{
								echo '<button id="btnAPropuesta" class="botonAceptar"><a> <i class="fa fa-flag"></i> Hacer mi propuesta</a></button>';	 
							  }
						  }
						?>
					</div>
					<div>
						<!-------------------------------------------------------->
						<?=$var['propuestas']?>
					</div>
				</div>	
				
				<div id="mi-mapa" style="display:none;font-size:25px;padding:5px;">
					<p>
					<div id="mapa_ubicacion" class="mapa"></div>
					</p>
				</div>
	</div><!--todo-->
					
	<? include $APP->footer;?>
	</body>
</html>